<template>
  <div class="sxpcwlkj-store_member-dialog-container">
    <el-dialog :title="state.dialog.title" v-model="state.dialog.isShowDialog" width="50vw"
               :close-on-click-modal="false">
      <el-form ref="deptDialogFormRef" :model="state.ruleForm" size="default" label-width="150px">
        <el-form-item v-show="false" label="ID" prop="id">
          <el-input v-model="state.ruleForm.id" placeholder="ID"></el-input>
        </el-form-item>

        <el-form-item label="账号" prop="account">
          <el-input v-model="state.ruleForm.account" placeholder="账号"></el-input>
        </el-form-item>
        <el-form-item label="昵称" prop="nickname">
          <el-input v-model="state.ruleForm.nickname" placeholder="昵称"></el-input>
        </el-form-item>
        <el-form-item label="性别" prop="sex">
          <fast-select v-model="state.ruleForm.sex" dict-type="SYS_SEX" placeholder="性别"></fast-select>
        </el-form-item>
        <el-form-item label="手机号" prop="phone">
          <el-input v-model="state.ruleForm.phone" placeholder="手机号"></el-input>
        </el-form-item>
        <el-form-item label="密码" prop="password">
          <el-input v-model="state.ruleForm.password" placeholder="密码"></el-input>
        </el-form-item>
        <el-form-item label="头像" prop="headPortrait">
          <fast-img v-model="state.ruleForm.headPortrait" :imageUrl="state.ruleForm.headPortrait"
                    @update-imageUrl="onUrlheadPortrait"/>
        </el-form-item>
        <el-form-item label="生日" prop="birthday">
          <el-input v-model="state.ruleForm.birthday" placeholder="生日"></el-input>
        </el-form-item>
        <el-form-item label="微信openid" prop="wxOpenid">
          <el-input v-model="state.ruleForm.wxOpenid" placeholder="微信openid"></el-input>
        </el-form-item>
        <el-form-item label="信用分" prop="reputationScore">
          <el-input v-model="state.ruleForm.reputationScore" placeholder="信用分"></el-input>
        </el-form-item>
        <el-form-item label="级别" prop="level">
          <el-input v-model="state.ruleForm.level" placeholder="级别"></el-input>
        </el-form-item>
        <el-form-item label="邀请码" prop="invitationCode">
          <el-input v-model="state.ruleForm.invitationCode" placeholder="邀请码"></el-input>
        </el-form-item>
        <el-form-item label="支付密码" prop="payPassword">
          <el-input v-model="state.ruleForm.payPassword" placeholder="支付密码"></el-input>
        </el-form-item>
        <el-form-item label="状态" prop="status">
          <fast-select v-model="state.ruleForm.status" dict-type="SYS_STATE" placeholder="状态"></fast-select>
        </el-form-item>
        <el-form-item label="秘钥" prop="privateKey">
          <el-input v-model="state.ruleForm.privateKey" placeholder="秘钥"></el-input>
        </el-form-item>
        <el-form-item label="排序" prop="sort">
          <el-input v-model="state.ruleForm.sort" placeholder="排序"></el-input>
        </el-form-item>
        <el-form-item label="支付宝OPENID" prop="alipayOpenid">
          <el-input v-model="state.ruleForm.alipayOpenid" placeholder="支付宝OPENID"></el-input>
        </el-form-item>
        <el-form-item label="抖音OPENID" prop="douyinOpenid">
          <el-input v-model="state.ruleForm.douyinOpenid" placeholder="抖音OPENID"></el-input>
        </el-form-item>
        <el-form-item label="最后登录IP" prop="lastLoginIp">
          <el-input v-model="state.ruleForm.lastLoginIp" placeholder="最后登录IP"></el-input>
        </el-form-item>
        <el-form-item label="备注" prop="remark">
          <el-input type="textarea" v-model="state.ruleForm.remark"></el-input>
        </el-form-item>
      </el-form>
      <template #footer>
        <el-button @click="onCancel" size="default">取 消</el-button>
        <el-button type="primary" @click="onSubmit" size="default">{{ state.dialog.submitTxt }}</el-button>
      </template>
    </el-dialog>
  </div>
</template>

<script setup lang="ts" name="sxpcwlkjStore_memberDialog">
import {reactive, defineAsyncComponent, ref} from 'vue';
// 引入组件
const FastEditor = defineAsyncComponent(() => import('/@/components/editor/index.vue'));
import FastSelect from "/@/components/fast-select/src/fast-select.vue";
import FastRadioGroup from "/@/components/fast-radio-group/src/fast-radio-group.vue";
import FastImg from "/@/components/fast-upload/img.vue";
import FastImgs from "/@/components/fast-upload/imgs.vue";
import FastFile from "/@/components/fast-upload/file.vue";
import {store_memberApi} from '/@/api/sxpcwlkj/store_member';

const baseApi = store_memberApi();
// 定义子组件向父组件传值/事件
const emit = defineEmits(['refresh']);
const store_memberDialogFormRef = ref();

const state = reactive({
  ruleForm: {
    id: '',
    nickname: '',
    account: '',
    sex: '',
    phone: '',
    password: '',
    headPortrait: '',
    birthday: '',
    wxOpenid: '',
    reputationScore: '',
    level: '',
    invitationCode: '',
    payPassword: '',
    status: '',
    privateKey: '',
    sort: '',
    alipayOpenid: '',
    revision: '',
    tenantId: '',
    douyinOpenid: '',
    createdBy: '',
    lastLoginIp: '',
    createdTime: '',
    updatedBy: '',
    updatedTime: '',
    remark: ''
  },
  dialog: {
    isShowDialog: false,
    type: '',
    title: '',
    submitTxt: '',
  },
});
// 重置
const resetFomr = () => {
  state.ruleForm = {
    id: '',
    nickname: '',
    account: '',
    sex: '',
    phone: '',
    password: '',
    headPortrait: '',
    birthday: '',
    wxOpenid: '',
    reputationScore: '',
    level: '',
    invitationCode: '',
    payPassword: '',
    status: '',
    privateKey: '',
    sort: '',
    alipayOpenid: '',
    revision: '',
    tenantId: '',
    douyinOpenid: '',
    createdBy: '',
    lastLoginIp: '',
    createdTime: '',
    updatedBy: '',
    updatedTime: '',
    remark: ''
  }
}
const openDialog = (type: string, row: RowStore_memberType) => {
  resetFomr();
  state.dialog.isShowDialog = true;
  if (type === 'edit') {
    state.ruleForm = row;
    state.dialog.title = '修改';
    state.dialog.submitTxt = '修 改';
  }
  if (type === 'add') {
    state.dialog.title = '新增';
    state.dialog.submitTxt = '新 增';
  }
};
// 关闭弹窗
const closeDialog = () => {
  state.dialog.isShowDialog = false;
};
// 取消
const onCancel = () => {
  closeDialog();
};
// 提交
const onSubmit = () => {
  emit('refresh', state.ruleForm);
};
const onUrlheadPortrait = (data) => {
  state.ruleForm.headPortrait = data;
}
// 暴露变量
defineExpose({
  openDialog, closeDialog
});
</script>
